<template>
  <div>
    <!-- 信息包中元数据的可读性检测 -->
    <div v-if="item.dId == '1311' && item.isDetection != '0'" class="divBox">
      <el-collapse-item class="my-collapse-item" :disabled="item.isPass == '1'">
        <template slot="title">
          <p style="width: 60%">检测项目: 信息包中元数据的可读性检测</p>
          <p>检测对象: 元数据</p>
        </template>
        <el-tabs v-model="activeLength" style="width: 90%">
          <el-tab-pane label="卷层" name="first" v-if="subStr == 'V' || subStr == 'X'">
            <el-checkbox-group v-model="folderSelected" :disabled="item.isPass == '1'" @change="getFolderSelected">
              <div style="display: flex; flex-wrap: wrap;">
                <div v-for="(checkboxItem,index) in folderOption" class="checkBox" :key="index">
                  <el-checkbox :value="checkboxItem.value" :key="checkboxItem.value" :label="checkboxItem.value" @change="handleChange(checkboxItem)">{{ checkboxItem.label }}</el-checkbox>
                </div>
              </div>
            </el-checkbox-group>
            <el-pagination :current-page="folderCurrentPage" :page-size="folderPageSize" :total="folderTotal" @current-change="handleFolderPageChange"></el-pagination>
          </el-tab-pane>
          <el-tab-pane label="件层" name="second">
            <el-checkbox-group v-model="fileSelected" :disabled="item.isPass == '1'" @change="getFileSelected">
              <div style="display: flex; flex-wrap: wrap;">
                <div v-for="(checkboxItem,index) in fileOption" class="checkBox" :key="index">
                  <el-checkbox :value="checkboxItem.value" :key="checkboxItem.value" :label="checkboxItem.value" @change="handleChange(checkboxItem)">{{ checkboxItem.label }}</el-checkbox>
                </div>
              </div>
            </el-checkbox-group>
            <el-pagination :current-page="fileCurrentPage" :page-size="filePageSize" :total="fileTotal" @current-change="handleFilePageChange"></el-pagination>
          </el-tab-pane>
        </el-tabs>
      </el-collapse-item>
    </div>

    <!-- 目标数据库中的元数据可访问性检测 -->
    <div v-if="item.dId == '1312' && item.isDetection != '0'" class="divBox">
      <el-collapse-item class="my-collapse-item" :disabled="item.isPass == '1'">
        <template slot="title">
          <p style="width: 60%">检测项目: 目标数据库中的元数据可访问性检测</p>
          <p>检测对象: 元数据</p>
        </template>
        <el-tabs v-model="activeLength" style="width: 90%">
          <el-tab-pane label="卷层" name="first" v-if="subStr == 'V' || subStr == 'X'">
            <el-checkbox-group v-model="folderSelected" :disabled="item.isPass == '1'" @change="getFolderSelected">
              <div style="display: flex; flex-wrap: wrap;">
                <div v-for="(checkboxItem,index) in folderOption" class="checkBox" :key="index">
                  <el-checkbox :value="checkboxItem.value" :key="checkboxItem.value" :label="checkboxItem.value" @change="handleChange(checkboxItem)">{{ checkboxItem.label }}</el-checkbox>
                </div>
              </div>
            </el-checkbox-group>
            <el-pagination :current-page="folderCurrentPage" :page-size="folderPageSize" :total="folderTotal" @current-change="handleFolderPageChange"></el-pagination>
          </el-tab-pane>
          <el-tab-pane label="件层" name="second">
            <el-checkbox-group v-model="fileSelected" :disabled="item.isPass == '1'" @change="getFileSelected">
              <div style="display: flex; flex-wrap: wrap;">
                <div v-for="(checkboxItem,index) in fileOption" class="checkBox" :key="index">
                  <el-checkbox :value="checkboxItem.value" :key="checkboxItem.value" :label="checkboxItem.value" @change="handleChange(checkboxItem)">{{ checkboxItem.label }}</el-checkbox>
                </div>
              </div>
            </el-checkbox-group>
            <el-pagination :current-page="fileCurrentPage" :page-size="filePageSize" :total="fileTotal" @current-change="handleFilePageChange"></el-pagination>
          </el-tab-pane>
        </el-tabs>
      </el-collapse-item>
    </div>

    <!-- 内容数据格式检测 -->
    <div v-if="item.dId == '1321' && item.isDetection != '0'" class="divBox">
      <el-collapse-item class="my-collapse-item" :disabled="item.isPass == '1'">
        <template slot="title">
          <p style="width: 60%">检测项目: 内容数据格式检测</p>
          <p>检测对象: 内容数据</p>
        </template>
        <div style="padding-left: 3%">
          <div v-if="phase == '0'||phase=='4'">
            依据要求进行检测，判断其是否符合GB/T 18894 2016、GB/T 33190等标准要求 <br>
            <el-checkbox-group v-model="selected" :disabled="item.isPass == '1'" @change="getSelected">
              <el-checkbox v-for="dict in dict.type.GDGSJC" :value="dict.value" :key="dict.value" :label="dict.value">{{ dict.label }}</el-checkbox>
            </el-checkbox-group>
          </div>
          <div v-if="phase == '1'">
            依据GB/T 18894 2016、GB/T 33190等标准，对电子档案内容数据格式进行检测，判断其是否符合移交要求 <br>
            <el-checkbox-group v-model="selected" :disabled="item.isPass == '1'" @change="getSelected">
              <el-checkbox v-for="dict in dict.type.YJGSJC" :value="dict.value" :key="dict.value" :label="dict.value">{{ dict.label }}</el-checkbox>
            </el-checkbox-group>
          </div>
        </div>
      </el-collapse-item>
    </div>

    <!-- 内容数据的可读性检测（人工检测） -->
    <div v-if="item.dId == '1322' && item.isDetection != '0'" class="divBox">
      <el-collapse-item class="my-collapse-item" :disabled="item.isPass == '1'">
        <template slot="title">
          <p style="width: 60%">检测项目: 内容数据的可读性检测（人工检测）</p>
          <p>检测对象: 内容数据（包括原始格式和转换格式）</p>
        </template>
        <el-radio @change="getRadio" v-model="radio" :label="'1'">默认通过</el-radio>
      </el-collapse-item>
    </div>

    <!-- 内容数据格式长期可用性检测 -->
    <div v-if="item.dId == '1323' && item.isDetection != '0'" class="divBox">
      <el-collapse-item class="my-collapse-item" :disabled="item.isPass == '1'">
        <template slot="title">
          <p style="width: 60%">检测项目: 内容数据格式长期可用性检测</p>
          <p>检测对象: 电子档案元数据</p>
        </template>
        <div style="padding-left: 3%">
          a)依据GB/T 18894 2016、GB/T 33190、DA/T 47的要求进行检测；<br>
          b)根据用户定义的长期保存格式策略进行检测<br>
          <el-checkbox-group v-model="selected" :disabled="item.isPass == '1'" @change="getSelected">
            <el-checkbox v-for="dict in dict.type.CQKYXJC" :value="dict.value" :key="dict.value" :label="dict.value">{{ dict.label }}</el-checkbox>
          </el-checkbox-group>
        </div>
      </el-collapse-item>
    </div>

    <!-- 软硬件环境合规性检测 -->
    <div v-if="item.dId == '1331' && item.isDetection != '0'" class="divBox">
      <el-collapse-item class="my-collapse-item" :disabled="item.isPass == '1'">
        <template slot="title">
          <p style="width: 60%">检测项目: 软硬件环境合规性检测</p>
          <p>检测对象: 电子属性信息</p>
        </template>
        <div style="padding-left: 3%">
          <div v-if="phase == '0'||phase == '4'">
            <el-radio @change="getRadio" v-model="radio" :label="'1'">对电子属性信息中记录的软硬件环境信息进行检测,判断其是否符合归档要求</el-radio>
          </div>
          <div v-if="phase == '1'">
            <el-radio @change="getRadio" v-model="radio" :label="'1'">对电子属性信息中记录的软硬件环境信息进行检测,判断其是否符合移交要求</el-radio>
          </div>
        </div>
      </el-collapse-item>
    </div>

    <!-- 保存环境变化情况检测 -->
    <div v-if="item.dId == '1332' && item.isDetection != '0'" class="divBox">
      <el-collapse-item class="my-collapse-item" :disabled="item.isPass == '1'">
        <template slot="title">
          <p style="width: 60%">检测项目: 保存环境变化情况检测</p>
          <p>检测对象: 内容数据</p>
        </template>
        <div style="padding-left: 3%">
          依据电子档案属性信息中记录的系统环境信息,对长期保存的软硬件环境信息进行检测,判断长期保存环境的变化情况<br>
          <el-checkbox-group v-model="selected" :disabled="item.isPass == '1'" @change="getSelected">
            <el-checkbox v-for="dict in dict.type.BCHJBHJC" :value="dict.value" :key="dict.value" :label="dict.value">{{ dict.label }}</el-checkbox>
          </el-checkbox-group>
        </div>
      </el-collapse-item>
    </div>

    <!-- 信息包中包含的内容数据格式合规性检测 -->
    <div v-if="item.dId == '1341' && item.isDetection != '0'" class="divBox">
      <el-collapse-item class="my-collapse-item" :disabled="item.isPass == '1'">
        <template slot="title">
          <p style="width: 60%">检测项目: 信息包中包含的内容数据格式合规性检测</p>
          <p>检测对象: 内容数据</p>
        </template>
        <div style="padding-left: 3%">
          <div v-if="phase == '0'||phase == '4'">
            对归档信息包是否包含非公开压缩算法、是否加密、是否包含不符合归档要求的文件格式等进行检测 <br>
            <el-radio @change="getRadio" v-model="radio" :label="'1'">是否加密</el-radio>
          </div>
          <div v-if="phase == '1'">
            对移交信息包是否包含非公开压缩算法、是否加密、是否包含不符合移交要求的 文件格式等进行检测 <br>
            <el-radio @change="getRadio" v-model="radio" :label="'1'">是否加密</el-radio>
          </div>
        </div>
      </el-collapse-item>
    </div>

    <!-- 备份数据可恢复性检测 -->
    <div v-if="item.dId == '1351' && item.isDetection != '0'" class="divBox">
      <el-collapse-item class="my-collapse-item" :disabled="item.isPass == '1'">
        <template slot="title">
          <p style="width: 60%">检测项目: 备份数据可恢复性检测</p>
          <p>检测对象: 备份数据</p>
        </template>
        <div style="padding-left: 3%">
          <div v-if="phase == '2'">
            <el-radio @change="getRadio" v-model="radio" :label="'1'">采用专业的备份数据恢复工具检测备份数据是否完好,是否可恢复</el-radio>
          </div>
        </div>
      </el-collapse-item>
    </div>

  </div>
</template>

<script>
import {getLastIndexOf} from "@/utils";
import {getSchemelist} from "@/api/archive/fourNatures/detectionPlan";

export default {
  name: "availability",
  props: ["item", "phase", "detail"],
  archive_Dicts: ['GDGSJC', 'YJGSJC', 'CQKYXJC', 'BCHJBHJC'],
  data() {
    return {
      selected: [],
      params: {},
      // 单选框
      radio: '',

      // 元数据项数据长度检测
      activeLength: '',
      subStr: "",  //获取列表的 件 卷  项目 截取 sub_table_name显示
      folderOption: [],
      fileOption: [],
      folderSelected: [],
      fileSelected: [],

      folderCurrentPage: 1,
      folderPageSize: 10, // 每页显示的条目数
      folderPageNum: 1, // 当前页码
      folderTotal: 0,

      fileCurrentPage: 1,
      filePageSize: 10, // 每页显示的条目数
      filePageNum: 1, // 当前页码
      fileTotal: 0,
      dataInfo: undefined
    }
  },
  watch: {
    item: {
      handler(val) {
        this.dataInfo = JSON.parse(JSON.stringify(val))
        this.getDataInfo()
      },
      immediate: true,
      deep: true
    },
    detail: {
      handler(val) {
        if(val.subTableName != null) {
          this.subStr = getLastIndexOf(val.subTableName)
          if(this.subStr == 'V' || this.subStr == 'X') {
            this.getFolderOption()
            this.getFileOption()
            this.activeLength = 'first'
          } else {
            this.getFileOption()
            this.activeLength = 'second'
          }
        }
      },
      immediate: true,
      deep: true
    },
  },
  methods: {
    // 单选框
    getRadio() {
      if(this.item.isPass == 0 && this.item.isDetection == 1) {
        let params = JSON.parse(JSON.stringify(this.params))
        params.dId = this.item.dId
        params.isDetection = this.item.isDetection
        params.isPass = this.item.isPass
        params.detectionItemList = []
        var obj = {}
        obj.name = this.radio
        obj.style = 'radio' // 单选框
        setTimeout(() => {
          params.detectionItemList.push(obj)
        }, 0)
        this.$nextTick(() => {
          this.changeTap(params)
          this.params = JSON.parse(JSON.stringify(params))
        })
      }
    },
    // 多选框
    getSelected() {
      if(this.item.isPass == 0 && this.item.isDetection == 1) {
        if (this.item.dId == '1111') {
          // 勾选数字摘要
          var isPacket = null
          var isSignature = null
          if(this.selected.includes('1')) {
            this.activeNames = '1153'
            isPacket = false
            this.$emit("handleChangeGhxx",this.activeNames, isPacket)
          } else if(!this.selected.includes('1')) {
            this.activeNames = '1153'
            isPacket = true
            this.$emit("handleChangeGhxx",this.activeNames, isPacket)
          }
          // 勾选电子签名
          if(this.selected.includes('2')) {
            this.activeNames = '1155'
            isSignature = false
            this.$emit("handleChangeGhxx",this.activeNames, isPacket, isSignature)
          } else if(!this.selected.includes('2')) {
            this.activeNames = '1155'
            isSignature = true
            this.$emit("handleChangeGhxx",this.activeNames, isPacket, isSignature)
          }
        }
        this.params.dId = this.item.dId
        this.params.isDetection = this.item.isDetection
        this.params.isPass = this.item.isPass
        this.params.detectionItemList = []
        for (let i = 0; i < this.selected.length; i++) {
          var obj = {}
          obj.name = this.selected[i]
          obj.value = this.selected[i]
          obj.style = 'checkbox' // 多选框
          this.params.detectionItemList.push(obj)
        }
        this.$nextTick(() => {
          this.changeTap(this.params)
        })
      }
    },
    // 卷多选框
    getFolderSelected() {
      if(this.item.isPass == 0 && this.item.isDetection == 1) {
        let params = JSON.parse(JSON.stringify(this.params))
        params.dId = this.item.dId
        params.isDetection = this.item.isDetection
        params.isPass = this.item.isPass
        if (params.detectionItemList != null && params.detectionItemList != undefined) {
          if (params.detectionItemList.length != 0) {
            params.detectionItemList = JSON.parse(JSON.stringify(params.detectionItemList.filter(item => {
              return item.type != '1';
            })));
          }
        } else {
          params.detectionItemList = []
        }
        var arr = params.detectionItemList
        for (let i = 0; i < this.folderSelected.length; i++) {
          var obj = {}
          obj.name = this.folderSelected[i]
          obj.type = '1'
          obj.style = 'check' // 多选框
          arr.push(obj)
        }
        params['detectionItemList'] = JSON.parse(JSON.stringify(arr))
        this.$nextTick(() => {
          this.changeTap(params)
          this.params = JSON.parse(JSON.stringify(params))
        })
      }
    },
    // 件多选框
    getFileSelected() {
      if(this.item.isPass == 0 && this.item.isDetection == 1) {
        let params = JSON.parse(JSON.stringify(this.params))
        params.dId = this.item.dId
        params.isDetection = this.item.isDetection
        params.isPass = this.item.isPass
        if (params.detectionItemList != null && params.detectionItemList != undefined) {
          if (params.detectionItemList.length != 0) {
            params.detectionItemList = JSON.parse(JSON.stringify(params.detectionItemList.filter(item => {
              return item.type != '0';
            })));
          }
        } else {
          params.detectionItemList = []
        }
        var arr = params.detectionItemList
        for (let i = 0; i < this.fileSelected.length; i++) {
          var obj = {}
          obj.name = this.fileSelected[i]
          obj.type = '0'
          obj.style = 'check' // 多选框
          arr.push(obj)
        }
        params['detectionItemList'] = JSON.parse(JSON.stringify(arr))
        this.$nextTick(() => {
          this.changeTap(params)
          this.params = JSON.parse(JSON.stringify(params))
        })
      }
    },
    getDataInfo() {
      if (this.dataInfo.detectionItemList != null) {
        if (this.dataInfo.detectionItemList.length != 0) {
          for (let i = 0; i < this.dataInfo.detectionItemList.length; i++) {
            if (this.dataInfo.detectionItemList[i].style == 'checkbox') {
              this.selected.push(this.dataInfo.detectionItemList[i].name)
            }
            this.selected = [...this.selected]

            if (this.dataInfo.detectionItemList[i].style == 'check') {
              if (this.dataInfo.detectionItemList[i].type == '1') {
                this.folderSelected.push(this.dataInfo.detectionItemList[i].name)
              } else if (this.dataInfo.detectionItemList[i].type == '0') {
                this.fileSelected.push(this.dataInfo.detectionItemList[i].name)
              }
            }
            this.folderSelected = [...this.folderSelected]
            this.fileSelected = [...this.fileSelected]

            if (this.dataInfo.detectionItemList[i].style == 'radio') {
              this.$set(this, 'radio', this.dataInfo.detectionItemList[i].name);
            }
          }
        }
      }
    },
    changeTap(item) {
      this.$emit('ChangeTap', item)
    },
    handleChange(item) {
      if(item.editable == false) {
        item.editable = true
      } else {
        item.editable = false
      }
    },
    // 获取卷元数据
    getFolderOption() {
      this.form = {
        categoryId: this.detail.categoryId,
        isMetadata: 1,
        type: 1,
        pageNum: this.folderPageNum,
        pageSize: this.folderPageSize
      }
      this.getMetaData(this.form)
    },
    // 获取件元数据
    getFileOption() {
      this.form = {
        categoryId: this.detail.categoryId,
        isMetadata: 1,
        type: 0,
        pageNum: this.filePageNum,
        pageSize: this.filePageSize
      }
      this.getMetaData(this.form)
    },
    // 卷分页
    handleFolderPageChange(currentPage) {
      this.folderPageNum = currentPage;
      this.getFolderOption()
    },
    // 件分页
    handleFilePageChange(currentPage) {
      this.filePageNum = currentPage
      this.getFileOption()
    },
    // 正常元数据
    getMetaData(form) {
      getSchemelist(form).then(response=>{
        if(form.type == '1') {
          this.folderOption = []
          this.folderOption = response.rows.map(item=>{
            return {
              value: item.id,
              label: item.fieldCaption,
              editable: false
            }
          })
          for (let i = 0; i < this.fileSelected.length; i++) {
            this.folderOption.forEach((item) => {
              if (item.id == this.fileSelected[i]) {
                item.editable = true;
              }
            });
          }
          this.folderTotal = response.total
        } else {
          this.fileOption = []
          this.fileOption = response.rows.map(item=>{
            return {
              value: item.id,
              label: item.fieldCaption,
              editable: false
            }
          })
          for (let i = 0; i < this.fileSelected.length; i++) {
            this.fileOption.forEach((item) => {
              if (item.id == this.fileSelected[i]) {
                item.editable = true;
              }
            });
          }
          this.fileTotal = response.total
        }
      })
    },
  }
}
</script>

<style lang="scss" scoped>
.my-collapse-item::after {
  content: "";
  display: block;
  border-bottom: 1px solid #ebeef5; /* 下边界线样式 */
}
.my-collapse-item {
  width: 100%;
}

.divBox {
  display: flex;
}

.checkBox {
  flex-basis: 30%;
  margin-bottom: 1%;
  .el-checkbox {
    width: 30%;
  }
}
</style>
